import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'
import { userInfo } from 'os';
import { getItem } from '@/utils/storage';

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: 'Home',
    // component: Home
    redirect: "/admin/home"
  },
  // 登录路由
  {
    path: '/login',
    name: 'Login',
    component: () => import("../views/login/login.vue")
  },
  // 注册路由
  {
    path: '/register',
    name: 'Register',
    component: () => import("../views/login/register.vue")
  },
  // 管理业首页
  {
    path: "/admin",
    name: "Admin",
    component: () => import("../components/layout/Admin.vue"),
    children: [
      // 首页
      {
        path: "home",
        name: "AdminHome",
        component: () => import("../views/admin/Home.vue"),
      },
      // 试题列表页
      {
        path: "question/list",
        name: "QuestionList",
        component: () => import("../views/admin/question/List.vue")
      }
    ]
  },
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

// 解决 elementUI 导航跳转时报错的问题
const originalPush = VueRouter.prototype.push;
VueRouter.prototype.push = function (location) {
  return originalPush.call(this, location).catch(err => err)
}
// 导航守卫 限制访问路径
// 登录后可以访问管理页面 否则跳转至登录页面
router.beforeEach((to,form,next) => {
  // to 要访问的路由
  // form 上一个路由
  // next() 想要继续做路由跳转 next函数是必须的
  // 管理页面是 /admin/xxx/xxx
  const reg = /^\/admin\/*/;  //定义规则
  const userInfo = getItem("userInfo");

  // 如果访问的是管理路由
  if(reg.test(to.path)) {
    // 判断用户是否已经登录
    if(userInfo) {
      // 已经登录可以继续访问
      next()
    }else {
      // 否则 跳转至登录页面
      next("/login")
    }
  }
  // 如果访不是管理页面 可直接访问
  next();
})

export default router
